<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="../node_modules/bootstrap-icons/font/bootstrap-icons.css">
    <title>Document</title>
    <style>
        .topbar {
            height: 35px;
            font-size: 12px;
        }

        .topbar ul {
            text-align: center;
            /* 居中对齐 */
            list-style: none;
            /* 去掉默认的列表样式 */
            padding: 0;
            /* 去掉内边距 */
        }
    </style>
</head>

<body>
    <section class="header container">
        <div class="topbar d-flex justify-content-between">
            <ul class="d-flex justify-content-center">
                <li class="mx-2">中国大陆<i class="bi bi-chevron-down"></i></li>
                <li class="red mx-2">亲，请登录</li>
                <li class="mx-2"></li>
                <li class="mx-2"></li>
            </ul>
            <ul class="d-flex">
                <li class="red">淘宝网首页</li>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
            </ul>
        </div>
        <div class="shortcut">
            <!-- 这里可以添加快捷操作内容 -->
        </div>
    </section>
</body>

</html>